<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
	<title>未处理的事件</title>
	<%@include file="/common/commonCSS.jsp" %>
	<%@include file="/common/commonJS.jsp" %>
	<%@include file="/WEB-INF/jsp/include/taglib.jsp" %>


	</head>
<body>
<div class="main-container" id="main-container">

	<div class="row" style="margin-top: 20px;">
		<div class="row" style="margin-top: 20px;">
			<div class="col-md-12">
				<form class="layui-form" id="search-from" action="${webRoot}/report/increport/IncChainDayNumber">
					<div class="layui-form-item">
						<label class="layui-form-label" style="width:6%;">名称:</label>
						<div class="layui-input-inline">
							<input type="text" name="name" value="${params.name}"  placeholder="请输入名称"  class="layui-input" >
						</div>
						<button class="layui-btn" id="searchSubmit"><i class="layui-icon">&#xe615;</i>搜 索</button>
						<button class="layui-btn layui-btn-warm" type="button" id="refresh">重 置</button>
						<%--<a class="layui-btn" href="${webRoot}/sla/slaalerttemp/info"><i class="layui-icon">&#xe61f;</i> 新 增</a>--%>
					</div>
				</form>
			</div>
		</div>
	</div>
	<div id="container1" style="min-width:400px;height:400px"></div><div id="container2" style="min-width:400px;height:400px"></div>
</div>
<script type="text/javascript">


    var result = ${data};
    var day = new Array();
    var count = new Array();
    var geometric = new Array();
    var opts = new Array();

    $.each(result, function(i,item) {
        day[i] = item.S_DATE.substring(8,10);
        count[i] = item.COUNT1;
        if(i == 0){
            geometric[0] = 0;
        }else if (i >=1){
            if(count[i] == 0 || count[i-1]==0){
                geometric[i] = 0;
            }else{
                geometric[i] = (count[i]-count[i-1])/count[i-1]*100;
            }
        }
        var tmpParam = {};
        tmpParam.sqlId = "IncGridQuery";
        tmpParam.inc_create_date = item.S_DATE,
            //删除endDate属性
            delete tmpParam.endDate;
        delete tmpParam.beginDate;
        opts[i] = tmpParam;
    });
    var series = [
        {
            name:"每日事件数量",
            data:count ,
            opts:opts
        }
    ];
    var clickFunction = function(e){
        var series = e.point.series;
        var tmpParam = series.options.opts[e.point.index];
        top.window.getListIncident(tmpParam);
    };
    var seriesGeometric = [
        {
            name:"环比增长率",
            data:geometric
        }
    ];
    $('#container1').highcharts({
        chart: {
            type: 'line',
            margin: [40, 20, 80, 80]
        },
        title: {
            text: '按日统计月事件工单数量折线图',
            x: -20
        },
        credits: {enabled:false},
        xAxis: {categories: day},
        yAxis: {
            title: { text: '数量' } ,
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }],
            min : 0
        },
        lang : {noData : '暂无数据显示'},
        plotOptions: {
            line: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    formatter: function() {
                        return Highcharts.numberFormat(this.y, 0, ',');
                    }
                },
                events:{
                    click:clickFunction
                }
            }
        },
        series: series
    });
    $('#container2').highcharts({

        chart: {
            type: 'column',
            margin: [10, 20, 80, 80]
        },
        credits: {enabled:false},
        title: {text: null},
        lang : {noData : '暂无数据显示'},
        plotOptions: {
            column: {
                depth: 25,
                dataLabels: {
                    enabled: true,
                    formatter: function() {
                        return Highcharts.numberFormat(this.y, 0, '.');
                        if(this.y == 0){
                            return ;
                        }else{
                            return Highcharts.numberFormat(this.y, 0, '.')+'%';
                        }
                    }
                },
                events: {click: clickFunction}
            }
        },
        tooltip : {
            formatter: function(){
                return '环比增长'+Highcharts.numberFormat(this.y, 2, '.') + '%';
            }
        },
        xAxis: {categories: day},
        yAxis: {
            title: {text: '环比增长率'}
        },
        series: seriesGeometric
    });





</script>
</body>

</html>